import dom from '@/utils/dom.js'
export default {
    data(){
        return{
            left:0,
            top:0,
            width:0,
            height:0           
        }
    },
    computed:{
        firstLevel(){
            return this.rootMenu && this.rootMenu == this.$parent;
        }
    },
    methods:{
        onEnterMenuItem(ev,rootMenu){

            this.$parent.submenus.forEach(item => {
                if(item.visible)
                    item.visible = false;
            });
            
            const name = this.$options.name;
            if( name == 'RsSubMenu'){
                let x = 0;
                const itemRect = dom.getBoundingClientRect(this.$refs.menuItem);
                const rsMenu = this.$refs.rsMenu;
                dom.setStyle(rsMenu,'display','block');
                const rsMenuRect = dom.getBoundingClientRect(rsMenu);
                if( rootMenu.openType === ''){
                    
                    const bodyRect = dom.getBoundingClientRect(document.body);
                    x = bodyRect.width - itemRect.left - rsMenuRect.width;
                    if( x > 0 ){
                        x = 0;
                        rootMenu.openType = "right";
                    }else{
                        rootMenu.openType = "left";
                    }
                }

                if( this.firstLevel && !rootMenu.contextMenu){
                    this.top = itemRect.height;
                    if( x >= 0 ){
                        this.left = 0;
                    }else{
                        this.left = x + itemRect.width;
                    }
                }else{
                    this.top = -2;
                    if( x >= 0 && rootMenu.openType == 'right'){
                        this.left = itemRect.width - 2;
                    }else{
                        this.left = 2 - rsMenuRect.width;
                    }
                }
                dom.setStyle(rsMenu,'display','none');
                this.$nextTick(()=>{
                    this.visible = true;
                })
            }else if( name == "RsMenuItem"){

                //
            }
        },
        onLeaveMenuItem(ev,rootMenu){

            if( !rootMenu.contextMenu && this.firstLevel ){
                rootMenu.openType = "";
            }            
        },
        onEnterMenu(ev,rootMenu){

            rootMenu.cnt ++;
        },
        onLeaveMenu(ev,rootMenu){

            rootMenu.cnt --; 
            if( rootMenu.timeoutHandler != null ){
                clearTimeout(rootMenu.timeoutHandler);
                rootMenu.timeoutHandler = null;
            }
            rootMenu.timeoutHandler = setTimeout(()=>{

                if( rootMenu.cnt == 0 ){
                    rootMenu.closeMenu();
                }
                rootMenu.timeoutHandler = null;
            },200)
        }
    }
}